import React, { Component } from 'react'
import {
	Text, View, TouchableOpacity
} from "react-native";
import { SpaceBetween } from '../../../create/_components/SpaceBetween.js';
import { CURRENCY } from '../../../../../utils/helper';
import MethodUtil from '../../../../../utils/MethodUtil';
import OrderApproveService from '../../_common/service';
import { styles } from '../../_common/style';
import { LightBox } from '../../../../../component/Store';
//关联成交
export class MappingSection extends Component {
	requesting;
	constructor(props) {
		super(props);
		this.state = {
			loaded: false
		}

		this._closeLightBox = this._closeLightBox.bind(this);
		this.lightBoxData = {
			onClosePress: this._closeLightBox,
			modalVisible: false,
			title: '',
			rowDataList: [],
		};
	}

	_closeLightBox () {
		this.lightBoxData.modalVisible = false;
		const { lightBoxVisible } = this.state;
		this.setState({
			lightBoxVisible: !lightBoxVisible,
		});
	}

	//批次关联
	async _didPressShowOppoOrderLightBox (data) {
		if (this.requesting) return;
		this.requesting = true;
		const { orderTypeName, orderId, itemId } = data;
		let goodsName = '';
		this.lightBoxData.rowDataList = [];
		this.setState({
			loaded: true
		});

		let orderDetail = await OrderApproveService.getApproveDetail({ approveType: this.props.approveType }, {
			orderId,
			itemId,
			queryType: 'ORDER_ALL_INFO',
		});

		this.setState({
			loaded: false
		});
		this.requesting = false;
		if (orderDetail) {
			if (orderDetail.orderItemList && orderDetail.orderItemList.length > 0) {
				orderDetail.orderItemList.map((item, index) => {
					goodsName += (index === 0 ? '' : ',') + item.goodsName;
					price = item.price;
				})
			}
		}
		this.lightBoxData.modalVisible = true;
		this.lightBoxData.title = orderTypeName + '成交报告';
		this.lightBoxData.rowDataList.push({ label: '成交编号：', val: orderDetail.orderId });
		this.lightBoxData.rowDataList.push({ label: '客户名称：', val: orderDetail.companyName });
		this.lightBoxData.rowDataList.push({ label: orderDetail.orderType === 'S' ? '收款类型：' : '付款类型：', val: orderDetail.payTypeName });
		this.lightBoxData.rowDataList.push({ label: orderDetail.orderType == 'S' ? '收款方式：' : '付款方式：', val: orderDetail.payStyleName });
		this.lightBoxData.rowDataList.push({ label: orderDetail.orderType == 'S' ? '收款期限：' : '付款期限：', val: OrderApproveService.setPayTypeName(orderDetail.payType) + orderDetail.payExpireDays + '天内' + (orderDetail.orderType == 'S' ? '收' : '付' + '款') });
		this.lightBoxData.rowDataList.push({ label: '商品名称：', val: goodsName });
		this.lightBoxData.rowDataList.push({ label: '交货方式：', val: orderDetail.orderType == 'P' ? orderDetail.purchaseDeliveryTypeName : orderDetail.saleDeliveryTypeName });
		this.lightBoxData.rowDataList.push({ label: '单价：', val: CURRENCY.getUnit(orderDetail.currency).label + (orderDetail.orderItemList && orderDetail.orderItemList.length > 0 ? MethodUtil.toThousands(orderDetail.orderItemList[0].price, 2) : 0) + CURRENCY.getUnit(orderDetail.currency).text });

		const { lightBoxVisible } = this.state;
		this.setState({
			lightBoxVisible: !lightBoxVisible
		});
	}

	render () {
		const { data, orderType } = this.props;
		if (data && data.length) {
			return (
				<View style={[styles.itemBox, styles.borders]}>
					<Text style={styles.itemTitle}>关联{orderType === 'S' ? '采购' : '销售'}</Text>
					{
						data.map((item, index) => {
							return (
								<TouchableOpacity key={index} activeOpacity={0.5} onPress={() => {
									this._didPressShowOppoOrderLightBox({
										orderTypeName: orderType === 'S' ? '采购' : '销售',
										orderId: orderType === 'S' ? item.purchaseOrderId : item.salesOrderId,
										itemId: orderType === 'S' ? item.purchaseOrderItemId : item.salesOrderItemId
									})
								}}>
									<SpaceBetween iconShow={true} fontLeft={{ title: item.goodsName }} fontRight={{ title: '匹配' + (orderType === 'S' ? '采购' : '销售') + '数量：' + (item.quantity || '0') + (item.uomName || '吨') }} />
								</TouchableOpacity>
							)
						})
					}
					<LightBox {...this.lightBoxData} />
				</View>
			)
		} else {
			return null;
		}
	}
}
